//  路由的配置文件
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '@/views/Home'
// 首页预加载
import Login from '@/views/Login'
import Register from '@/views/Register'
import Search from '@/views/Search'
import Detail from '@/views/Detail'
import AddCartSuccess from '@/views/AddCartSuccess'
import ShopCart from '@/views/ShopCart'
import Trade from '@/views/Trade'
import Pay from '@/views/Pay'
import PaySuccess from '@/views/PaySuccess'
import Center from '@/views/Center'
// 引入Vuex仓库
import store from '@/store'
// 引入二级路由组件
import MyOrder from '@/views/Center/myOrder'
import GroupOrder from '@/views/Center/groupOrder'

Vue.use(VueRouter)

// 先把VueRouter原型对象的push|repalce方法，先保存一份
const originPush = VueRouter.prototype.push
const originReplace = VueRouter.prototype.replace

// 重写push|repalce方法
// 重写的方法中：函数的三个参数分别为
// 1：告诉原来push方法，你往哪里跳转（传递哪些参数)
// 2：成功的回调
// 3：失败的回调、

VueRouter.prototype.push = function (location, resolve, reject) {
  if (resolve && reject){
    originPush.call(this, location, resolve, reject)
  } else {
    originPush.call(this, location, () => { }, () => { })
  }
}
VueRouter.prototype.replace = function (location, resolve, reject) {
  if (resolve && reject) {
    originReplace.call(location, resolve, reject)
  } else {
    originReplace.call(this, location, () => { }, () => {})
  }
}

const router = new VueRouter({

  // 路由滚动行为
  scrollBehavior (to, from, savedPosition) {
    // 跳转页面时滚动条默认会在顶部
    return { x: 0, y: 0 }
  },

  routes: [
    // 个人中心
    {
      path: '/center',
      component: Center,
      // 路由元信息，给组件标记属性判断控制显示
      meta: { show: true },

      // 注册2级路由组件
      children: [
        // 我的订单页面子组件重定向（默认显示）
        {
          path: '/',
          redirect: 'myorder'
        },

        {
          path: 'myorder',
          component: MyOrder
        },
        {
          path: 'grouporder',
          component: GroupOrder
        }

      ]
    },

    // 首页重定向
    {
      path: '/',
      redirect: '/home'
    },
    {
      path: '/home',
      component: Home,
      // 路由元信息，给组件标记属性判断控制显示
      meta: { show: true }
    },

    // 除首页其他页面懒加载（提高页面切换访问的效率）
    {
      path: '/login',
      component: () => import('@/views/Login'),
      meta: { show: false }
    },
    {
      path: '/register',
      component: () => import('@/views/Register'),
      meta: { show: false }
    },
    {
      // 首页搜索跳转到搜索页占位传参（?可传参可不传）
      path: '/search/:keyword?',
      component: () => import('@/views/Search'),
      // 路由元信息
      meta: { show: true },
      // 路由命名传参
      name: 'search'

    },
    // 详情页
    {
      // 地址占位传参
      path: '/detail/:skuid',
      component: Detail,
      meta: { Show: true }
    },
    // 加入购物车成功组件
    {
      path: '/addcartsuccess',
      component: AddCartSuccess,
      name: 'addcartsuccess',
      meta: { Show: true }
    },
    // 购物车
    {
      path: '/shopcart',
      component: ShopCart,
      // 路由元信息，给组件标记属性判断控制显示
      meta: { show: true }
    },
    // 结算交易
    {
      path: '/trade',
      component: Trade,
      // 路由元信息，给组件标记属性判断控制显示
      meta: { show: true },
      // 路由独享守卫
      beforeEnter: (to, from, next) => {
        // 去交易页面，必须从购物车页来
        if (from.path == '/shopcart') {
          next()
        } else {
          // 其它页面来的，不跳转留在当前页面
          next(false)
        }
      }
    },

    // 支付
    {
      path: '/pay',
      component: Pay,
      // 路由元信息，给组件标记属性判断控制显示
      meta: { show: true },
      // 路由独享守卫
      beforeEnter: (to, from, next) => {
        if (from.path == '/trade') {
          next()
        } else {
          next(false)
        }
      }
    },

    // 支付成功提示页面
    {
      path: '/paysuccess',
      component: PaySuccess,
      // 路由元信息，给组件标记属性判断控制显示
      meta: { show: true },
      // 路由独享守卫
      beforeEnter: (to, from, next) => {
        if (from.path == '/pay'){
          next()
        } else {
          next(false)
        }
      }
    }
  ]

})

export default router
// 全局路由前置守卫
// router.beforeEach(async (to, from, next) =>{
//   //  next();
//   //用户登录了，有token,反之则没有
//   let token = store.state.user.token
//   // 判断用户信息中某个属性是否存在，(vuex中用户信息初始值为{}，布尔值也为true)
//   let name = store.state.user.userInfo.name
//   if (token) {
//     //用户已登录要去登录页，使其返回首页
//     if (to.path == '/login' || to.path == '/register') {
//       next('/home')
//     } else {
//       //登录已有用户信息
//       if (name){
//         //放行跳转
//         next()
//       } else {
//         try {
//           //在已有token的情况下，无用户信息，派发获取用户信息的action
//           //获取用户信息成功
//           await store.dispatch('getUserInfo')
//           next()
//         } catch (error) {
//           // token过期
//           // 派发获取token 的 action ，回到登录页
//           await store.dispatch('userLogin')
//           next('/login')
//         }
//       }
//     }
//   } else {
//     // 未登录，无token,不能去支付、交易，订单个人中心，购物车等相关页面
//     //变量保存登录前要跳转的地址
//     let toPath = to.path
//     //地址路径的值为字符串
//     if (toPath.indexOf('/trade') != -1 || toPath.indexOf('/pay') != -1 || toPath.indexOf('/center') != -1 || toPath.indexOf('/shopcart') != -1) {
//       //跳转到登录页同时 保存要跳转页面query地址栏参数，登录成功后跳转到对应页面（登录页要进行有无参数的判断）
//       next('/login? redirect=' + toPath)
//     } else {
//       //其他页面正常跳转
//       next()
//     }
//   }
// })
